<template>
  <div>
    <h1>3.vue更新DOM是异步的</h1>
    <p ref="P">{{ count }}</p>
    <button @click="btn">count++</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      count: 1,
    };
  },
  methods: {
    btn() {
      this.count++; //2
      //立刻获取内容得到的是旧的内容
      console.log(this.$refs.P.innerText); //1
      //$nextTick可以立刻获取内容
      this.$nextTick(() => {
        console.log("$nextTick里的count", this.$refs.P.innerText);
      });
    },
  },
};
</script>

<style>
</style>